<!--
  文件下载页面
-->
<template>
  <div>
    <h1>政策文件下载</h1>
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <el-table
          :data="tableData"
          stripe
          style="width: 100%">
          <el-table-column
            prop="id"
            label="编号"
            width="180">
          </el-table-column>
          <el-table-column
            prop="createDate"
            label="日期"
            width="200">
          </el-table-column>
          <el-table-column
            prop="title"
            label="标题"
            width="700">
          </el-table-column>
          <el-table-column label="操作">
            <template slot-scope="scope">
              <el-button @click="File_view(scope.$index)" type="primary" size="small ">查看</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </el-card>

    <!--dialog模态框-->
    <el-dialog :visible.sync="dialogVisible" width="60%">
      <div class="dialog-style">
        {{file_content}}
      </div>
      <!--底部按钮-->
      <div slot="footer" class="dialog-footer">
        <el-button type="primary"><a :href="file_url">下 载</a></el-button>
        <el-button type="primary" @click="dialogVisible = false">关 闭</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import instance from "../../utils/request";

export default {
  name: "FileDownload",
  data(){
    return{
      dialogVisible:false,     //对话框显示标志
      file_url:'',             //文件url
      tableData: [],           //文件数据
      file_content:'',         //文件内容
    }
  },
  methods:{
    File_view(i){
      //显示dialog
      this.dialogVisible=true;
      //发送请求（发送文件编号） 接受文件内容
      let _this = this;
      instance.get("/api/notice/preview/" + _this.tableData[i].id).then(function (res){
        if (res.data.code === 200){
          _this.tableData[i].title = res.data.data.title;     //获取当前文件标题
          _this.file_content = res.data.data.content;
          _this.file_url = res.data.data.filePath;
          console.log(_this.file_url);
        }
        else{
          alert(res.data.code);
        }
      }).catch(function (err) {
        console.log(err);
      })

    },

  },
  created() {
    //查询所有
    let _this = this;
    instance.get("/api/worker/notice").then(function (res){
      if(res.data.code === 200){
        _this.tableData = res.data.data;
        console.log(res);
        // alert('查询成功');
      }
      else {
        alert('查询出错');
      }
    }).catch(function (err){
      console.log(err);
    });

  }
}
</script>

<style scoped>

</style>
